import React from 'react';
import { inject, observer} from 'mobx-react';
import {routerShape} from 'react-router';
import {Condition} from '../list/listCondition';
import {WeaErrorPage,WeaTools,WeaTop,WeaSearchGroup,WeaRightMenu,WeaAlertPage} from 'ecCom';
import {Button,Spin} from 'antd';
import {WeaLocaleProvider} from 'ecCom';
const getLabel = WeaLocaleProvider.getLabel;

@inject("cptConditionStore")
@observer
class ConditionReport extends React.Component {
    static contextTypes = {
        router: routerShape
    }
    constructor(props) {
        super(props);
    }
    resetHeight(height){
        jQuery(".cpt-query-condition").height(height - 60);
    }
    componentDidMount() {
        const {cptConditionStore} = this.props; 
        cptConditionStore.initDatas();
    }
    componentWillReceiveProps(nextProps) {
        const keyOld = this.props.location.key;
		const keyNew = nextProps.location.key;
        if(keyOld !== keyNew ) {
            const {cptConditionStore} = nextProps;
            cptConditionStore.initDatas();
        }
    }
    shouldComponentUpdate(nextProps, nextState) {
        return true;
    }
    render() {
        const { cptConditionStore } = this.props;
        const { loading,form ,verified,hasRight} = cptConditionStore;
        if (verified && !hasRight) {
            return (<WeaAlertPage ecId={`${this && this.props && this.props.ecId || ''}_WeaAlertPage@7co8wy`} >
                    <div style={{color : '#000'}}>
                        {getLabel(2012,'对不起，您暂时没有权限！')}
                    </div>
                </WeaAlertPage>
            )
        }
        const title = getLabel( 1439 ,"资产情况");
        if (verified && hasRight) {
            return (
                <div className='cpt-query'>
                    <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@xl50dz`} datas={this.getRightMenu()}>
                    <WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@yernhw`}
                        title={title}
                        loading={loading}
                        icon={<i className='icon-coms-fa' />}
                        iconBgcolor='#f14a2d'
                        getHeight={this.resetHeight.bind(this)}
                        buttons={[]}
                        buttonSpace={10}
                        showDropIcon={true}
                        dropMenuDatas={this.getRightMenu()} >
                            <div className='cpt-query-condition'>
                                <Condition ecId={`${this && this.props && this.props.ecId || ''}_Condition@1vqhm4`} listStore={cptConditionStore} form={form}></Condition>
                            </div>
                            <div className='cpt-query-btns'>
                                {this.getSearchButtons()}
                            </div>
                    </WeaTop>
                    </WeaRightMenu>
                </div>
            )
        }
        return <div style={{position:"absolute",width:"100%",top:"48%",textAlign:"center"}}><Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@o50pp5`} /></div>
    }
    getRightMenu(){
    	let btns = [];
    	btns.push({
            key: "search",
    		icon: <i className='icon-coms-search'/>,
            content:getLabel(197,"搜索"),
            onClick: this.forwardQueryResult.bind(this)
    	});
    	return btns;
    }
    getSearchButtons() {
        const { cptConditionStore } = this.props;
        const {clearFormFields} = cptConditionStore;
        const btnStyle = {borderRadius: 3, height: 28, width: 80}
        return [
            (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@mn76ec@search`} type="primary" style={btnStyle} onClick={this.forwardQueryResult.bind(this)}>{getLabel(197,"搜索")}</Button>),
            (<span style={{width:'15px', display:'inline-block'}}></span>),
            (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@jan2ic@reset`} type="ghost" style={btnStyle} onClick={()=>{clearFormFields();}}>{getLabel(2022,"重置")}</Button>)
        ]
    }
    forwardQueryResult(){
        const { cptConditionStore,location } = this.props;
        const path = "/cptConditionResult";
        this.context.router.push({
            pathname: "/main/cpt/report"+path
        });
    }
}

export default WeaTools.tryCatch(React, 
    props => <WeaErrorPage ecId={`${this && this.props && this.props.ecId || ''}_WeaErrorPage@1x2yxr`} msg={ props.error ? props.error : getLabel( 383324,'对不起，该页面异常，请联系管理员' )} />,
    {error: ""}
)(ConditionReport);